import React from 'react';

class Bar extends React.Component {
    constructor(props, context) {
        super(props, context)
        this.state = { v: props.v }

        this.onChange = (this.onChange).bind(this);
        this.setColor = this.props.setColor;
    } // 初始化状态
    static propTypes = {
    }


    onChange(event) {
        this.setState({ "v": parseInt(event.target.value) })
        this.setColor(this.props.color, this.state.v);
    }
    render = () => (
        <div className="bar_kaola">
            {this.props.color} :
        <div className="bar">
                <input type="range" min="0" max="255"
                    value={this.state.v}
                    onChange={this.onChange} />
                <input type="number" min="0" max="255"
                    value={this.state.v}
                    onChange={this.onChange} />
            </div>
        </div>
    )
}

export default Bar;